<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="/css/index.css" type="text/css">
    <script src="/lib/requirejs/require.js" data-main="/js/index"></script>

    <title>Document</title>
</head>
<body>
    <!-- header -->
    <header>
        <div class="header-wrap">
            <div class="logo"></div>
            <div class="tv-icon"></div>
            <div class="main-site">主站</div>
            <div class="search">
                <input type="text" class="search-bar"placeholder="活动,嘉宾,场馆">
                <div class="search-icon"></div>
            </div>
            <div class="register-login">
                <div class="register"><a href="/html/register.html" target="_blank">注册</a></div>
                <div class="middle-line"></div>
                <div class="login">登录</div>
            </div>
            <!-- <div class="user-info"><a target="_blank" href="https://account.bilibili.com/site/home.html"></a></div> -->
            <div class="order-and-icon">
                <div class="order-icon"></div>
                <div class="order-center">订单中心</div>
                
            </div>
        </div>
    </header>
    <!-- nav -->
    <nav></nav>
    <!-- 选项菜单 -->
    <div class="selector-list">
        <div class="city-selector">
            <div class="title">城市:</div>
            <dl>
                <dt>全国</dt>
                <dd style="color:#f25d8e;">上海</dd>
                <dd>北京</dd>
                <dd>广州</dd>
                <dd>成都</dd>
                <dd>武汉</dd>
                <dd>深圳</dd>
                <dd>南京</dd>
                <dd>沈阳</dd>
                <dd>杭州</dd>
                <dd class="dd-more">更多城市</dd>
            </dl>

        </div>
        <div class="type-selector">
                <div class="title">类型:</div>
                <dl>
                    <dt style="color:#f25d8e;">全部类型</dt>
                    <dd>音乐会(<span>16</span>)</dd>
                    <dd>演唱会(<span>10</span>)</dd>
                    <dd>其他展览(<span>10</span>)</dd>
                    <dd>其他演出(<span>8</span>)</dd>
                    <dd>主题漫展(<span>7</span>)</dd>
                    <dd class="dd-more">更多类型</dd>
                </dl>
        </div>
        <div class="order-selector">
                <div class="title">筛选:</div>
                <dl>
                    <dt style="color:#f25d8e;">全部时间</dt>
                    <dd>本周</dd>
                    <dd>本月</dd>
                    <dd class="dd-more">三个月内</dd>
                </dl>
        </div>
    </div>
    <!-- 商品列表 -->
    <!-- art-template -->
        <div class="products-list">
         <script src="/lib/art-template/template-web.js" id="template" type="text/html">
            {{each list prod}}
            <div class="prod">
                <img src="{{prod.img}}" alt="">
                <div class="detail">
                    <div class="id" style="display:none">{{prod.id}}</div>
                    <h3>{{prod.desc}}</h3>
                    <p class="time">{{prod.time}}</p>
                    <p class="address">{{prod.address}}</p>
                    <div class="not-free">
                        <span class="price-symbol">¥</span>
                        <span class="price">{{prod.price}}</span>
                        <span class="start">起</span>
                    </div>
                </div>
            </div>
            {{/each}}
            </script>
        </div>

    <!-- 分页 -->
    <div class="whole-pagination">
        <div class="pre"></div>
        <div class="pagination">
            <span>1</span>
            <span>2</span>
        </div>
        <div class="next"></div>
    </div>
    <div class="toolbar">
        <div class="suggest-icon"></div>
        <div class="backtop-icon"></div>
    </div>
    <!-- footer -->
    
    <div class="border"></div>
    <footer>
        <div class="footer-cnt">
            <div class="top">
                <dl>
                    <dt>bilibili</dt>
                    <dd>关于我们</dd>
                    <dd>友情链接</dd>
                    <dd>bilibili周边</dd>
                    <dd>联系我们</dd>
                    <dd>加入我们</dd>
                    <dd>官方认证</dd>
                </dl>
                <dl>
                    <dt>传送门</dt>
                    <dd>帮助中心</dd>
                    <dd>高级弹幕</dd>
                    <dd>活动专题页</dd>
                    <dd>侵权申诉</dd>
                    <dd>分院帽计划</dd>
                    <dd>活动中心</dd>
                    <dd>用户反馈论坛</dd>
                    <dd>壁纸站</dd>
                    <dd>名人堂</dd>
                </dl>
                <div class="weibo"></div>
            </div>
            <div class="bottom"></div>
        </div>
    </footer>
</body>
</html>